<include file="public@header"/>
<style type="text/css">
    .pic-list li {
        margin-bottom: 5px;
    }
</style>
</head>
<body>
<div class="wrap js-check-wrap">
    <div class="well form-inline margin-top-20""><a class="btn btn-default" href="{:url('Alsdk/DescribeUserDomains')}"><<返回域名列表</a>&nbsp;&nbsp;{$domain}</div>
    <ul class="nav nav-tabs">
        <li><a href="{:url('Alsdk/DescribeLiveStreamTranscodeInfo', array('domain'=>$domain))}">转码配置信息列表</a></li>
        <li><a href="{:url('Alsdk/AddLiveStreamTranscode', array('domain'=>$domain))}">添加转码配置</a></li>
        <li class="active"><a href="{:url('Alsdk/AddCustomLiveStreamTranscode', array('domain'=>$domain))}">添加自定义转码配置</a></li>
    </ul>
    <form action="{:url('Alsdk/AddCustomLiveStreamTranscode')}" method="post" class="form-horizontal js-ajax-form margin-top-20">
        <div class="form-group">
            <label class="col-sm-2 control-label"><span class="form-required">*</span>直播流所属应用名称:</label>
            <div class="col-md-6 col-sm-10">
                <input class="form-control" type="text" name="App" required value="" placeholder="AppName"/>
                <p class="help-block">AppName 名称与推流地址中的 AppName 名称对应，模板才能生效</p>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label"><span class="form-required">*</span>转码视频帧率:</label>
            <div class="col-md-6 col-sm-10">
                <input class="form-control" type="text" name="FPS" required value="" placeholder="单位：fps。取值范围：[1, 30]"/>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label"><span class="form-required">*</span>转码视频分辨率(宽*高):</label>
            <div class="col-md-2 col-sm-5">
                <input class="form-control" type="text" name="Width" required value="" placeholder="输入宽度"/>
                <!-- <p class="help-block">取值要求：Width ≥ 100；max(Height, Width) ≤ 1920；min(Height, Width) ≤ 1080</p> -->
            </div>
            <label class="col-sm-1 control-label">X</label>
            <div class="col-md-2 col-sm-5">
                <input class="form-control" type="text" name="Height" required value="" placeholder="输入高度"/>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label"><span class="form-required">*</span>转码模板自定义名称:</label>
            <div class="col-md-6 col-sm-10">
                <input class="form-control" type="text" name="Template" required value="" placeholder="取值要求：数字、大小写字母或短横线('-')"/>
                <p class="help-block">注意：不能与标准的转码模板命名重复。</p>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label"><span class="form-required">*</span>自定义转码模版类型:</label>
            <div class="col-md-6 col-sm-10">
                <select id="TemplateType" name="TemplateType" class="form-control">
                    <option value="h264" >标准模版</option>
                    <option value="h264-nbhd " >窄带高清模版</option>
                </select>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label"><span class="form-required">*</span>转码视频比特率:</label>
            <div class="col-md-6 col-sm-10">
                <input class="form-control" type="text" name="VideoBitrate" required value="" placeholder="单位：kbps。取值范围：[1，6000]"/>
                <p class="help-block">注意：转码视频会尽量接近您所设定的比特率, 但转码视频的实际比特率不能保证和您所设定的完全一致, 尤其是当您设定的比特率过大或过小时。</p>
            </div>
        </div>
        <input class="form-control" type="hidden" name="Domain" value="{$domain}"/>
        <div class="col-sm-offset-2 col-sm-10">
            <button type="button" class="btn btn-primary" id="js-ajax-submit">{:lang("SAVE")}</button>
            <a class="btn btn-default" href="{:url('Alsdk/DescribeLiveStreamTranscodeInfo', array('domain'=>$domain))}">返回</a>
        </div>
    </form>
</div>
<script type="text/javascript" src="__STATIC__/js/admin.js"></script>
<script type="text/javascript">
    $('#js-ajax-submit').on('click', function () {
        var data = {
            App:$.trim($("input[name='App']").val()),
            Domain:$.trim($("input[name='Domain']").val()),
            FPS:$.trim($("input[name='FPS']").val()),
            Width:$.trim($("input[name='Width']").val()),
            Height:$.trim($("input[name='Height']").val()),
            Template:$.trim($("input[name='Template']").val()),
            VideoBitrate:$.trim($("input[name='VideoBitrate']").val()),
            TemplateType:$("#TemplateType option:selected").val(),
        }
        if ( data.App == '' || data.App == null ) {
            tishi('AppName不能为空')
            return false
        } else if ( data.FPS == '' || data.FPS == null ) {
            tishi('转码视频帧率不能为空')
            return false
        } else if ( data.Width == '' || data.Width == null ) {
            tishi('转码视频宽度不能为空')
            return false
        } else if ( data.Height == '' || data.Height == null ) {
            tishi('转码视频高度不能为空')
            return false
        } else if ( data.Template == '' || data.Template == null ) {
            tishi('转码模板自定义名称不能为空')
            return false
        } else if ( data.VideoBitrate == '' || data.VideoBitrate == null ) {
            tishi('转码视频比特率不能为空')
            return false
        } else if ( data.TemplateType == '' || data.TemplateType == null ) {
            tishi('请选择模板类型')
            return false
        }
        $.ajax({
            url: "{:url('Alsdk/AddCustomLiveStreamTranscode')}",
            dataType: 'json',
            data: data,
            type: "POST",
            success: function(data){
                if (data.code == '1') {
                    noty({
                        text: data.msg,
                        type: 'success',
                        layout: 'topCenter',
                        modal: true,
                        timeout: 800,
                        callback: {
                            afterClose: function () {
                                if (data.url) {
                                    //返回带跳转地址
                                    window.location.href = data.url;
                                } else {
                                    //刷新当前页
                                    reloadPage(window);
                                }
                            }
                        }
                    }).show();
                } else if (data.code == '0') {
                    art.dialog({
                        content: data.msg,
                        icon: 'warning',
                        title: '提示',
                        ok: function () {
                            this.title(data.msg);
                            return true;
                        }
                    });
                }
            }
        });
    });

    // 信息提示
    function tishi(msg){
        art.dialog({
            id: 'warning',
            icon: 'warning',
            title: '提示',
            content: msg,
            cancelVal: '关闭',
            ok: function () {
              
            }
        });
    }
</script>
</body>
</html>
